.member-center{
  .vip-nav-bar{
    color: #000;
    line-height: 64px;
    text-align: center;
  }

  .vip-header{
    margin: 0 22px;
    padding: 28px 26px;
    box-sizing: border-box;
    background-size: cover;
    border-radius: 20px 20px 0 0;
    color: #1D2129;
    .header-box{
      display: flex;
      align-items: center;
      .box-img{
        width: 96px;
        height: 96px;
        display: block;
        border-radius: 50%;
      }
      .header-info{
        margin: 0 auto 0 24px;
        font-size: 28px;
        color: #1D2129;
        .h2{
          font-size: 32px;
          font-weight: 700;
          margin-bottom: 16px;
        }
      }
      .header-time{
        color:#777A7F;
        font-size: 28px;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        .time-button{
          width: 144px;
          line-height: 48px;
          background: #e7b366;
          color: #6B490D;
          text-align: center;
          border-radius: 32px;
          margin-top: 16px;
          font-size: 24px;
        }
      }
    }
  }  //  vip-header end

  .vip-main{
    position: relative;
    z-index: 1;
    padding: 44px 22px;
    background: #fff;
    .main-swiper{
      height: 320px;
    }
    .main-list{
      border-radius: 32px;
      box-sizing: border-box;
      background: #fff;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      padding-bottom: 20px;
      .list-item{
        width: 20%;
        font-size: 24px;
        color: #616469;
        text-align: center;
        line-height: 36px;
        padding: 0;
        margin-bottom: 32px;
        .item-icon{
          width: 80px;
          height: 80px;
        }
      }
    }  /// main-list end

    .main-banner{
      margin: 20px 0;
      .banner-img{
        width: 100%;
        display: block;
        border-radius: 20px;
      }
    }

    .main-integral{
      border-radius: 24px;
      background: linear-gradient(180.93deg, #DBEBFF -18.72%, #FFFFFF 83.26%);
      padding: 24px;
      .integral-title{
        display: flex;
        justify-content: space-between;
        align-items: center;
        .h2{
          font-size: 32px;
          font-weight: 500;
          color: #1D2129;
        }
        .h2-span{
          font-size: 28px;
          color: #8E9094;
        }
      }

      .integral-goods{
        display: flex;
        overflow-x: auto;
        font-size: 24px;
        margin-top: 24px;
        .goods-item{
          margin-right: 16px;
          width: 208px;
          text-align: center;
          background: #fff;
          border-radius: 20px;
          overflow: hidden;
          .item-img{
            width: 208px;
            height: 208px;
            display: block;
          }
          .h2{
            line-height: 1;
            margin: 12px 0;
          }
          .item-span{
            border: 1px solid #7D93FD;
            display: flex;
            align-items: center;
            border-radius: 6px;
            line-height: 1;
            font-size: 20px;
            text-align: center;
            .left{
              background: #3D5DFB;
              color: #fff;
              padding: 4px;
            }
            .right{
              padding: 4px;
              color: #3D5DFB;
              flex: 1;
            }
          }
          .item-price{
            color: #f73;
            font-size: 26px;
          }
        }
      }
    } //  main-gift end
    
    .main-recommend{
      .title{
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        margin: 48px 0 0;
        color: #66490E;
        &::before,&::after{
          width: 106px;
          height: 4px;
          background: linear-gradient(270deg, #F7DFAB 100%, #F1BE8F 0%);
          border-radius: 4px;
          display: block;
          content: '';
          margin: 0 10px;
        }
      }

      .recommend-list{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin: 24px 0;
        .list-title{
          flex-basis: 100%;
          font-size: 32px;
          font-weight: 700;
          color: #1D2129;
          padding-top: 12px;
        }
        .list-item{
          width: 344px;
          margin-top: 24px;
          border-radius: 20px;
          overflow: hidden;
          .item-img{
            width: 100%;
            height: 384px;
            display: block;
          }
          .item-h2{
            width: 100%;
            font-size: 28px;
            margin-bottom: 20px;
          }
          .item-info{
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 24px;
            color: #A5A6A9;
            .info-price{
              color: #f73;
              font-size: 36px;
              font-weight: 700;
            }
          }
        }
      } //  recommend-list end
    } // main-recommend end

  }  //  vip-main end

}